<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        // 生成器（generator)
        // ES新增语法：作用：快速的生成迭代器
        // 生成器 一个特殊的迭代器函数, 调用了生成器函数之后，内部的代码不会直接执行，而是先返回一个生成器对象， 
        // 生成器对象，因为内部也有一个next方法，所以它也是迭代器
        function* gen(){
            console.log("这是一个生成器函数");
            return "generator";
        }
        const it = gen();//不仅仅是赋值，还可以执行
        console.log(it.next());


        // yieId关键字，类似于return语句
        function* gen1(){
            console.log("这是一个生成器函数");
            yield 1;
            yield 2;
            yield 3;
            return "generator";//不是因为是最后一句所以是{value: undefined, done: true}，而是因为return
        }
        const it1 = gen1();//不仅仅是赋值，还可以执行
        console.log(it1.next());
        console.log(it1.next());
        console.log(it1.next());
        console.log(it1.next());




        function* gen2(arr){
            for(let i = 0;i<arr.length;i++){
                yield arr[i];
            }
        }
        const it2 = gen2(["a","b","c"]);
        console.log(it2.next())
        console.log(it2.next())
        console.log(it2.next())
        console.log(it2.next())


        // yield 的使用特性
        // 1. yield只能够在生成器函数中使用  
        // 2. yield类似于return， return语句执行，意味会从所在函数中彻底跳出， yield执行也会（暂时）跳出 

        function* gen3(){
            console.log("生成器被启动");
            yield 1;  // console.log(it3.next());第一次只会执行到这里，会暂时性的跳出来
            console.log("第一个yield已经被执行"); //写第二个的时候才会执行这个
            yield 2;
            console.log("第二个yield已经被执行");
            return 3;
            console.log("函数执行完毕");   
            yield 4;
        }

        const it3 = gen3();
        console.log(it3.next());
        console.log(it3.next());
        console.log(it3.next());
        console.log(it3.next());
    </script>
</body>
</html>